import React, { useState,lazy,Suspense } from 'react'
// import Text from '../page/Text'

// 异步加载组件  必须配合Suspense组件使用
const Text = lazy(() => import('../page/Text'))
const Child2 = () => {
  const [show,setShow] = useState(false)
  return (
    <div>
      <h2>Child2</h2>
      <button onClick={() => setShow(!show)}>显示隐藏</button>
      {/* 详情组件加载之前展示的内容 */}
      <Suspense fallback={<div className='loading'>加载中。。。</div>}>
        {show && <Text />}
      </Suspense>
    </div>
  )
}

export default Child2